<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8" />
  <title>index</title>
  <!-- 引入Vue -->
  <script type="text/javascript" src="../../js/vue.js"></script>
</head>

<body>
  <!-- 准备好一个容器-->
  <div id="demo">
    <ul>
      <li v-for="p in persons">{{p.name}}---{{p.id}}---{{p.age}}</li>
    </ul>
  </div>
</body>

<script type="text/javascript">
  const vm = new Vue({
    el: "#demo",
    data() {
      return {
        persons: [
          { id: 1, name: "张三", age: 18 },
          { id: 2, name: "李四", age: 28 },
          { id: 3, name: "王五", age: 38 },
          { id: 4, name: "赵六", age: 48 },
        ]
      }
    }
  })

</script>

</html>